<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>客人信息管理</title>
    <link rel="icon" type="image/png" href="img/favicon.png" />
    <link rel="stylesheet" href="css/amazeui.min.css" />
    <link rel="stylesheet" href="css/layer.css" />
    <link rel="stylesheet" href="css/admin.css" />
    <link rel="stylesheet" href="css/app.css" />
    <script src="jquery/jquery.js"></script>
    <script src="js/echarts.min.js"></script>
    <script src="js/amazeui.min.js"></script>
    <script type="text/javascript" src="jquery/manage_ajax.js"></script>


</head>
<body>
<ol class="am-breadcrumb">
    <li><a href="base" class="am-icon-home">首页</a></li>
    <li class="am-active">顾客信息</li>
</ol>
<div style="background:white">
<h1 style="text-align: center;">客人信息管理</h1>
<hr>
    <table class="am-table am-table-bd am-table-striped am-table-hover">
        <thead>
            <tr>
            <th>客人ID</th>
                <th>用户名</th>
                <th> 昵称 </th>
                <th> 密码 </th>
                <th>手机号</th>
                <th>身份证</th>
                <th> 性别 </th>
            </tr>
        </thead>
<tbody id="show">

</tbody>

</table>
    <button type="button" class="am-btn am-btn-xs am-round" onclick="javascript:upPage();" >上一页</button>&nbsp;&nbsp;<button type="button" class="am-btn am-btn-xs am-round" onclick="javascript:downPage();" >下一页</button>
<br/>
    <br/>

<div class="am-g">
        <div class="am-btn-toolbar">
            <div class="am-btn-group  ">
                <button  type="button" style="margin-right:20px ;margin-left:700px" class="am-btn  am-btn-success "  data-am-modal="{target: '#doc-modal-1'}"><span class="am-icon-plus"></span> 新增</button>
                <button  type="button" style="margin-right:20px" class="am-btn am-btn-default am-btn-secondary " data-am-modal="{target: '#doc-modal-2'}" ><span class="am-icon-circle"></span> 修改</button>
                <button  type="button" style="margin-right:20px" class="am-btn am-btn-default am-btn-danger " data-am-modal="{target: '#doc-modal-3'}"><span class="am-icon-trash-o"></span> 删除</button>

        </div>
    </div>

</div>
    <div class="am-modal am-modal-no-btn " tabindex="-1" id="doc-modal-1" style="margin-top:-500px" >
        <div class="am-modal-dialog" >
            <div class="am-modal-hd">
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd">
                        <form class="am-form">
                            <fieldset>
                                <legend>新增客户信息</legend>
                                <div class="am-form-group">
                                <label for="username">用户名</label>
                                     <input type="text" id="username" >
                                </div>
                                <div class="am-form-group">
                                <label for="pet_name">昵称</label>
                                     <input type="text" id="pet_name">
                                </div>
                                <div class="am-form-group">
                                <label for="password">密码</label>
                                    <input type="password" id="password">
                                </div>
                                <div class="am-form-group">
                                <label for="sex">性别</label>
                                  <input type="text" id="sex">
                                </div>
                                <div class="am-form-group">
                                <label for="email">电子邮箱</label>
                                 <input type="email" id="email">
                                </div>
                                <div class="am-form-group">
                                <label for="phone">手机</label>
                                 <input type="text" id="phone">
                                </div>
                                <div class="am-form-group">
                                <label for="id_card">身份证</label>
                                 <input type="text" id="id_card" >
                                </div>
                                <input type="button" class="am-btn am-btn-default am-round" value="取消" data-am-modal-close>
                            <input type="button" class="am-btn am-btn-primary am-round" id="button1" value="确认">
                            </fieldset>
                        </form>
            </div>
        </div>
    </div>

    <div class="am-modal am-modal-no-btn " tabindex="-1" id="doc-modal-2" style="margin-top:-500px" >
        <div class="am-modal-dialog" >
            <div class="am-modal-hd">
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd">
                <form class="am-form">
                    <fieldset>
                        <legend>修改客户信息</legend>
                        <div class="am-form-gruop">
                        <label for="customer_id"> 请输入要修改的客人id</label>
                                    <input type="text" id="customer_id">
                        </div>
                        <div class="am-form-gruop">
                            <label for="username1">用户名</label>
                                    <input type="text" id="username1" >
                        </div>
                            <div class="am-form-gruop">
                                <label for="pet_name1">昵称</label>
                                <input type="text" id="pet_name1" >
                            </div>
                                <div class="am-form-gruop">
                                    <label for="password1">密码</label>
                                    <input type="text" id="password1" >
                                </div>
                                    <div class="am-form-gruop">
                                        <label for="sex1">性别</label>
                                        <input type="text" id="sex1" >
                                    </div>
                                        <div class="am-form-gruop">
                                            <label for="email1">电子邮箱</label>
                                            <input type="text" id="email1" >
                                        </div>
                                            <div class="am-form-gruop">
                                                <label for="phone1">手机</label>
                                                <input type="text" id="phone1" >
                                            </div>
                                                <div class="am-form-gruop">
                                                    <label for="id_card1">身份证</label>
                                                    <input type="text" id="id_card1">
                                                </div>

                        <input type="button" class="am-btn am-btn-default am-round" value="取消" data-am-modal-close>
                        <input type="button" class="am-btn am-btn-primary am-round" id="button3" value="修改">
                    </fieldset>
                </form>
            </div>
        </div>
    </div>

    <div class="am-modal am-modal-no-btn " tabindex="-1" id="doc-modal-3" style="margin-top:-500px" >
        <div class="am-modal-dialog" >
            <div class="am-modal-hd">
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd">
                <form class="am-form">
                    <fieldset>
                        <legend>删除客户信息</legend>
                        <div class="am-form-gruop">
                            <label for="customer_id1"> 请输入要删除的客人id</label>
                            <input type="text" id="customer_id1">
                        </div>
                        <input type="button" class="am-btn am-btn-default am-round" value="取消" data-am-modal-close>
                        <input type="button" class="am-btn am-btn-danger am-round" id="button4" value="删除">
                    </fieldset>
                </form>
            </div>
        </div>
    </div>
</div>
</body>
</html>
